import React from 'react';
import { inject, observer } from 'mobx-react';
import { message, Modal, Button } from 'antd';
import { WeaTableNew } from "comsMobx";
import { WeaAuth, WeaPopoverHrm, WeaLocaleProvider, WeaRightMenu } from "ecCom";
import * as Util from '../../../util/Util.js';
const toJS = mobx.toJS;
const confirm = Modal.confirm
const getLabel = WeaLocaleProvider.getLabel;
const WeaTable = WeaTableNew.WeaTable;
@inject('planViewStore')
@observer
export default class PlanAndSummary extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            showOperation: false, //显示操作框
            selectedRowKeys: [], //选中行
            rightMenu: [
                {
                    key: "0",
                    icon: <i className="icon-coms-Add-to" />,
                    content: getLabel(365, '新建'),
                    onClick: () => this.addCreate()
                },
                {
                    key: "1",
                    icon: <i className="icon-coms-Delete" />,
                    disabled: true,
                    content: getLabel(32136, '批量删除'),
                    onClick: () => this.del()
                }
            ],
            _height: Util.getCurrentHeight() - 75,
            delids: "" //删除id
        };
        this.rowSelection = {selectedRowKeys: this.state.selectedRowKeys,
            onChange: this.onSelectChange};
        this.store = this.props.planViewStore;
    }
    componentWillMount() {
        //一些初始化请求
        this.store.getShareSearch();
    }
    render() {
        let { hasRight, shareTableStore, shareConditioninfo, editshare } = this.store;
        let { showOperation, selectedRowKeys, rightMenu, _height, delids } = this.state;
        return (
            <div className="wea-workrelate-plan-report-view-share" style={{ height: _height }}>
                <div className='share-operation-btn-container'>
                    {editshare && <div>
                        <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ow0g9f`} className='share-operation-btn' type='primary' onClick={() => this.addShare()}>{<i
                            className="icon-coms-Add-to-hot"

                        />}</Button>
                        <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@u53q8d`} className='share-operation-btn' type='primary' onClick={() => this.del()}>{<i
                            className="icon-coms-form-delete-hot"
                            style={{ color: `${delids.length > 0 ? '#55a1f8' : '#d8d8d8'}` }}
                        />}</Button>
                    </div>}

                </div>
                <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@r1923t`} // table内部做了loading加载处理，页面就不需要再加了
                    comsWeaTableStore={shareTableStore} // table store
                    hasOrder={true} // 是否启用排序
                    needScroll={true} // 是否启用table内部列表滚动，将自适应到父级高度
                    rowSelection={this.rowSelection}
                    pagination={false}
                    onOperatesClick={this.onOperatesClick} //右键菜单操作
                />
                <WeaPopoverHrm ecId={`${this && this.props && this.props.ecId || ''}_WeaPopoverHrm@prnxqg`} />
                <WeaAuth ecId={`${this && this.props && this.props.ecId || ''}_WeaAuth@q433hv`}
                    visible={showOperation}
                    icon="icon-coms-implement"
                    iconBgcolor='rgb(150, 53, 138)'
                    conditions={toJS(shareConditioninfo)}
                    title={getLabel(384113, '添加')}
                    onOk={(data) => {
                        this.operationShare(data);
                    }}
                    onCancel={() => {
                        this.setState({ showOperation: false });
                    }}
                />
            </div>
        )
    }
    //打开权限dialog
    addShare = () => {
        this.setState({ showOperation: true });
    }
    //新增
    operationShare = (data) => {
        let params = { ...data };
        params.operate = "add"
        params.workrelatetype = 4
        params.bizid = this.store.planid
        params.hasRight = this.store.editshare
        params.resourceid = this.store.resourceid
        this.store.shareOperate(params);
        this.setState({ showOperation: false });
    }
    //每行右侧操作数据
    onOperatesClick = (record, index, operate, flag) => {
        let id = record.id;
        if (id.length > 0) {
            this.delDate(id);
        }
    }
    //删除
    del = () => {
        let { delids } = this.state;
        this.delDate(delids);
    }
    delDate = (ids) => {
        if (ids.length > 0) {
            Modal.confirm({
                title: getLabel(386786, '信息确认'),
                content: getLabel(508867, '确定删除已选数据？'),
                onOk: () => {
                    this.store.shareOperate({ ids: ids, operate: "del", workrelatetype: 4, bizid: this.store.planid, hasRight: this.store.editshare,resourceid:this.store.resourceid });
                    this.setState({ selectedRowKeys: [], delids: [], rightMenu: this.updateStateArray(1, "disabled", true, this.state.rightMenu) });
                    if (typeof this.props.onCallBack === "function") {
                        this.props.onCallBack(false);
                    }
                },
                onCancel: () => {
                    return false;
                }
            })
        } else {
            message.error(getLabel(508946, '删除勾选不能为空'));
            return;
        }
    }
    //勾选check框
    onSelectChange = (selectedKeys, selectedRows) => {
        let keys = toJS(selectedKeys);
        let len = keys.length;
        let { rightMenu } = this.state;
        let ids = "";
        for (let i = 0; i < len; i++) {
            ids += keys[i] + ",";
        }
        if (ids != "") {
            ids = ids.substring(0, ids.length - 1);
        }
        this.setState({ delids: ids });
        if (ids.length > 0) {
            if (typeof this.props.onCallBack === "function") {
                this.props.onCallBack(true);
            }
            this.setState({ rightMenu: this.updateStateArray(1, "disabled", false, rightMenu) });
        } else {
            if (typeof this.props.onCallBack === "function") {
                this.props.onCallBack(false);
            }
            this.setState({ rightMenu: this.updateStateArray(1, "disabled", true, rightMenu) });
        }
    };
    updateStateArray = (i, key, value, arr) => {
        arr.map(item => {
            if (item.key == i) {
                item[key] = value;
            }
        })
        return arr;
    }
}
